/**
 * @(#)Category.less 0.5.1 2017-09-13
 * Copyright (c) 2017, YUNXI. All rights reserved.
 * YUNXI PROPRIETARY/CONFIDENTIAL. Use is subject to license terms.
 */
@color-grey: #e5e5e5;
@import '../../config/basic';

.tree {
  // overflow: hidden;
  // overflow-y: auto;
  font-size: 14px;
  :global{
    .ant-tree-title{
      width:100%;
      font-size: 14px;
    }
    .ant-tree-node-content-wrapper{
      width:100%;
    }
    .ant-tree{
      overflow: hidden;
    }
  }
}

.conetentLeft {
  // border-right: 1px solid @color-grey;
  background: #fff;

  :global {
    .ant-tree.ant-tree-show-line li span.ant-tree-switcher {
      z-index: 2800;
      position: relative;
      background: rgba(255,255,255,0);
      top: 6px;
    }
    .ant-tree.ant-tree-show-line li span.ant-tree-switcher.ant-tree-switcher-noop:after {
      font-family: "iconfont" !important;
      content: "\e6be";
      font-size: 16px;
    }
    
  }
  .area1 {
   padding: 16px;
   background: #FBFBFB;
    // border-bottom: 1px solid @color-grey;
  }
  .area2 {
    padding: 16px 0;
    background: #FBFBFB;
    overflow: scroll;
  }
}

.conetentRight {
  padding: 16px;
}

.content {
  background: #FFFFFF;
  box-shadow: 0 2px 4px 0 rgba(0,0,0,0.08);
  border-radius: 4px;
  padding: 20px;
}

.btnContent {
  .btnFirst {
    //border-right: none;
    //border-radius: 4px;
  }
  .btn {
    width: 100%;
    //border-radius: 0px 4px 4px 0;
  }
  :global {
    .ant-btn {
      height: 24px;
      padding: 0 4px;
      width: 100%;
    }
    .anticon {
      margin-right: 5px;
      &:before {
        margin-left: 4px;
      }
    }
    i {
      color: @uiColor_1;
    }
  }
}

.pagination {
  :global ul.ant-pagination {
    margin-right: 0;
  }
}
.treeTitle{
  height:32px;
  line-height: 32px;
  width: 100%;
  display: block;
  position: relative;
  box-sizing: content-box;
  &:hover{
    background: #E0E0E0;
    // transform: scale(1.5);
    // transform: translateX(-120px);
    // width: 200%;
    left: -150px;
    padding-left:150px; 
  }
  &:hover .treeTitleHover{
    display: block;
    // width:150%;
  }
  .treeTitleHover{
    position: absolute;
    right: 20px;
    top: 0;
    display: none;
    span {
      float: right;
      margin-right:10px; 
    }
  }
  .btnHover{

  }
}
